<%@ page language="java" pageEncoding="UTF-8"%>
<%@include file="/pc/jsp/common/common.jsp"%>
<%@ page language="java" import="com.limao.DBDataClass.CrowdUserAuthClass"%>
<% 
  String userid=(String)CacheClass.isLogin(request,response);
 if(CacheClass.getIntValue(userid)==0)
 {
 	out.println("<script language='JavaScript'>alert('您还没有登陆！');location.href=document.referrer;</script>"); //后退并刷新
 } 
 CrowdUserAuthClass user= WebFunction.getUserInfo(request,response);
 if(user==null)
 {
	 out.println("<script language='JavaScript'>alert('用户不存在，或被平台禁用，请联系客服！');window.history.back(-1);</script>");
	 return;
 } 
%>
<!DOCTYPE html>
<html lang="en" xmlns="http://www.w3.org/1999/html">
<head>
    <title>修改手机号</title>
    <style>
        body{
            width: 100%;
            height: 100%;
            background: transparent;
        }
    </style>
</head>
<body ontouchstart="">

<div class="loginBlock of bcf w100 h100">
    <div class="logintittle of tc pr">
        修改手机号 <span class="pa cursor" id="close-x">&times;</span>
    </div>
    <div class="of jz" style="width: 454px;">
        <input type="text" name="" id="tel" placeholder="<%=user.mobile %>" value="<%=user.mobile %>" disabled="disabled" class="db br3 jz br3" style="margin-top: 72px;cursor: not-allowed"/>
        <p class="t2 cred f14"></p>
        <div class="clearfix of">
            <input type="text" name="" id="telVerificationCode" placeholder="短信验证码" class="db br3 fl" style="width: 200px;"/>
            <input type="button" value="获取验证码" name="" id="VerificationCodeBtn"  onclick="smsSend()" class="cursor tc cf fr db f18 btnOrange"/>
        </div>
        <p class="t2 cred f14"></p>        
        <input type="text" name="" id="telNew" placeholder="新手机号码" class="db br3 jz br3"/>
        <p class="t2 cred f14"></p>
        <div class="clearfix of" style="margin-top: 46px;">
            <input type="button" value="修&nbsp;改" name="" id="loginSub" class="cursor tc cf fl db btnBlue" onclick="javascript:Sub();" style="width: 100%"/>
        </div>
    </div>
</div><!--loginBlock-->
<div id="loadingfDiv" class="loadingfDiv pf w100 h100 db">
    <div class="w100 h100">
        <img src="pc/images/loading.gif" class="db jz" style="margin-top: 40%;">
    </div>
</div><!--loadingfDiv-->


<script>

    $(window).on("load", function() {
        $("#modifyMoblieBtn", parent.document).click(function () {
            $("#modifyMoblieIframeDiv", parent.document).slideDown();
            $(".theme-popover-mask", parent.document).fadeIn();

        });
        $("#close-x").click(function () {
            $("#modifyMoblieIframeDiv", parent.document).slideUp();
            $(".theme-popover-mask", parent.document).fadeOut();

        });

    });
    
    //发送验证码
    function smsSend() {
    
        $.ajax({
            url: "LoginServlet",
            data: ''+JSON.stringify({m:30,mobile : $.trim($('#tel').val())}),
            type: 'post',
            dataType: 'json',
            contentType:"application/json;charset=utf-8",
            beforeSend: function () {
            },
            success: function (data) {
             	  resetCode($('#VerificationCodeBtn')); //倒计时
	              if(data['state']==1)
					layer.alert(data.info);
				  else
				  	layer.alert(data.info);
            },
            error: function (data) {
                layer.alert('网络忙，请重试');
            },
            complete: function () {
            }
        });
    }
    
     //倒计时
    var countdown=60;
    function resetCode(btn) {
        console.log('倒计时');
        if (countdown == 0) {
            btn.removeAttr("disabled");
            btn.val("重新获取验证码");
            countdown = 60;
            return;

        } else {
            btn.attr("disabled", "disabled");
            btn.val("请在" + countdown + "s内填写");
            countdown--;
        }
        setTimeout(function() { resetCode(btn); },1000);
    }
       
    var pattern = /^1[0-9]{10}$/;
    function Sub() {

        var telNew =$.trim($('#telNew').val());
        var telVerificationCode = $.trim($('#telVerificationCode').val());
        if(telNew== ""){
            $('#telNew').next('p').text('你还未填写联系电话');
            return false;
        }else if (!pattern.test(telNew)) {
            $('#telNew').next('p').text('手机号填写的格式不对，请正确填写');
            return false;
        }else {
            $('#telNew').next('p').text(' ');
        }

        if(telVerificationCode ==""){
            $('#telVerificationCode').parent('div').next('p').text('你还未填写手机验证码');
            return false;
        }
        if(!(telVerificationCode =="")){
            $('#telVerificationCode').parent('div').next('p').text(' ');
        }

        $.ajax({
            url: "LoginServlet",
            data: ''+JSON.stringify({m:21,oldmobile:$.trim($('#tel').val()),newmobile :telNew,code:telVerificationCode}),
            type: 'post',
            dataType: 'json',
            contentType:"application/json;charset=utf-8",
            beforeSend: function () {
                $("#loadingfDiv").fadeIn();
            },
            success: function (data) {
             	  resetCode($('#VerificationCodeBtn')); //倒计时
	              if(data['state']==1)
					layer.alert(data.info);
				  else
				  	layer.alert(data.info);
            },
            error: function (data) {
                layer.alert('网络忙，请重试');
            },
            complete: function () {
              $("#loadingfDiv").fadeOut();
              parent.location.reload();
            }
        });
    }

</script>
</body>
</html>